<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <parameter-encoding default-charset="UTF-8"/>
    <ui:composition template="template/layout.xhtml">
        <ui:define name="title">Projet 1 : Acceuil</ui:define>
        <ui:define name="navigation">
            <ul>
                <ui:repeat var="cat" value="#{produitManagedBean.liste}" varStatus="status">
                    <li>
                        <h:outputLink value="categorie.xhtml?id=#{cat.id}">#{cat.nom}</h:outputLink>
                        <ul>
                            <ui:repeat var="souscat" value="#{cat.sousCategories}" varStatus="status2">
                                <li><h:outputLink value="souscategorie.xhtml?id=#{souscat.id}">#{souscat.nom}</h:outputLink></li>
                            </ui:repeat>
                        </ul>
                    </li>
                </ui:repeat>
            </ul>            
        </ui:define>

        <ui:define name="content">
            <h:form id="formPasserCommande">
                <p:panel id="panelPasserCommande">
                    #{mbPasserCommande.etapeCommande}  
                    <p:panelGrid  styleClass="panelgridlogin" >  
                        <p:row>
                            <p:column>
                                <p:commandButton value="Adresse de livraison"  action="#{mbPasserCommande.changerEtapeVue(1)}" update=":formPasserCommande:panelPasserCommande"></p:commandButton>
                            </p:column>
                            <p:column>
                                <p:commandButton value="Mode de livraison" disabled="#{mbPasserCommande.etapeCommande lt 2}" update=":formPasserCommande:panelPasserCommande" action="#{mbPasserCommande.changerEtapeVue(2)}"></p:commandButton>
                            </p:column>
                            <p:column> 
                                <p:commandButton value="Confirmation de la commande" disabled="#{mbPasserCommande.etapeCommande lt 3}" update=":formPasserCommande:panelPasserCommande" action="#{mbPasserCommande.changerEtapeVue(3)}"></p:commandButton>  
                            </p:column>
                            <p:column>
                                <p:commandButton value="Paiement" disabled="#{mbPasserCommande.etapeCommande lt 4}" update=":formPasserCommande:panelPasserCommande" action="#{mbPasserCommande.changerEtapeVue(4)}"></p:commandButton>  
                            </p:column>
                        </p:row>
                    </p:panelGrid>
                    <p:panel header="Adresse Livraison" rendered="#{mbPasserCommande.etapeVue lt 2}" id="panelAdresse">
                        <p:accordionPanel id="AccordionAdresse">  
                            <p:tab title="Adresse de #{mbeanLogin.compteClient.prenom}" id="tabAdressePerso">  
                                <h:panelGrid columns="1" style="margin-bottom:10px"> 
                                    <h:outputText value="#{mbeanLogin.compteClient.civilite} #{mbeanLogin.compteClient.nom} #{mbeanLogin.compteClient.prenom}"/>
                                    <h:outputText value="#{mbeanLogin.compteClient.adresse}"/>
                                    <h:outputText value="#{mbeanLogin.compteClient.codePostal}"/>
                                    <h:outputText value="#{mbeanLogin.compteClient.ville}"/>
                                    <h:outputText value="#{mbeanLogin.compteClient.telMobile}"/>
                                    <h:outputText value="#{mbeanLogin.compteClient.telFixe}"/>
                                </h:panelGrid>
                                <p:commandButton value="Accepter" action="#{mbPasserCommande.validerFormulaireAdresse(mbeanLogin.compteClient,mbeanLogin.compteClient)}" update=":formPasserCommande:panelPasserCommande"  />
                                <p:commandButton value="Modifier mes informations"/>
                            </p:tab>  
                            <p:tab title="Autre adresse">  
                                <h:panelGrid columns="2" style="margin-bottom:10px" cellpadding="5"> 
                                    <h:outputText value="Civilité : "/>                          
                                    <p:selectOneRadio id="options" value="#{mbPasserCommande.adresse.civilite}">  
                                        <f:selectItem itemLabel="Mr" itemValue="Mr" />  
                                        <f:selectItem itemLabel="Mme" itemValue="Mme" />  
                                        <f:selectItem itemLabel="Mlle" itemValue="Mlle" />  
                                    </p:selectOneRadio> 

                                    <h:outputLabel value="Nom : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.nom}"/>

                                    <h:outputLabel value="Prénom : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.prenom}"/>

                                    <h:outputLabel value="Adresse : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.adresse}"/>

                                    <h:outputLabel value="Code postal : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.codePostal}"/>

                                    <h:outputLabel value="Ville : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.adresse}"/>

                                    <h:outputLabel value="Tel fixe : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.telFixe}"/>

                                    <h:outputLabel value="Tel mobile : "/>
                                    <p:inputText value="#{mbPasserCommande.adresse.telMobile}"/>


                                    <p:commandButton id="submitButton" action="#{mbPasserCommande.validerFormulaireAdresse(mbeanLogin.compteClient)}" value="Valider" update=":formPasserCommande:panelPasserCommande"/>  

                                </h:panelGrid> 
                            </p:tab>  
                        </p:accordionPanel>
                        <h:messages errorClass="error"/>  

                    </p:panel>  
                    <p:panel header="Mode de livraison" rendered="#{mbPasserCommande.etapeVue == 2}">
                        <h:outputText value="Basic Usage: " />  
                        <p:selectOneMenu value="#{mbPasserCommande.indexLivraison}">  
                            <f:selectItem itemLabel="" itemValue="" />  
                            <f:selectItem itemLabel="Colissimo - 10€" itemValue="1" />  
                            <f:selectItem itemLabel="Fedex - 15€" itemValue="2" />  
                            <f:selectItem itemLabel="Fedex Express - 30€" itemValue="3" />  
                        </p:selectOneMenu>  

                        <p:commandButton action="#{mbPasserCommande.validerModeLivraison()}" value="Valider" update=":formPasserCommande:panelPasserCommande"/>  
                    </p:panel>

                    <p:panel header="Recapitulatif Commande" rendered="#{mbPasserCommande.etapeVue == 3}">
                        <p:dataTable id="datatable" var="prod"  value="#{mbPanier.produitsList}" emptyMessage="Panier vide">  
                            <p:column>  
                                <f:facet name="header">  
                                    <h:outputText value="Nom produit" />  
                                </f:facet>  
                                <h:outputText value="#{prod.produitVignette.nom}" />  
                            </p:column>

                            <p:column>  
                                <f:facet name="header">  
                                    <h:outputText value="Quantité" />  
                                </f:facet> 
                                <h:outputText  value="#{prod.quantite}" />
                                <f:facet name="footer">  
                                    <h:outputText value="Frais de livraison" />
                                </f:facet>  
                            </p:column> 

                            <p:column >  
                                <f:facet name="header">  
                                    <h:outputText value="Prix" />  
                                </f:facet>  
                                <h:outputText id="updateprixproduit"  value="#{prod.produitVignette.prix * prod.quantite}€" />  
                                <f:facet name="footer" >  
                                    <h:outputText value="#{mbPasserCommande.commande.fraisLivraison}" style="text-align:left" />
                                </f:facet> 
                            </p:column>



                            <f:facet name="footer"> 
                                <row>
                                    <p:column colspan="2">  
                                        Livraison:  
                                    </p:column>
                                    <p:column>  
                                        Livraison:  
                                    </p:column> 
                                    <h:outputText id="liv" value="Prix total = #{mbPanier.calculerPrixTotal()}"></h:outputText>
                                </row>
                            </f:facet> 
                        </p:dataTable>

                        <p:panelGrid  styleClass="panelgridlogin" >  
                            <p:row>
                                <p:column>    
                                    <p:fieldset legend="Adresse de livraison">
                                        <h:outputLabel value="#{mbPasserCommande.commande.civiliteLivraison} #{mbPasserCommande.commande.nomLivraison}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.prenomLivraison}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.adresseLivraison}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.codePostalLivraison}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.villeLivraison}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.telFixeLivraison}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.telMobileLivraison}"/>
                                    </p:fieldset>
                                </p:column>
                                <p:column>
                                    <p:fieldset legend="Adresse de facturation">
                                        <h:outputLabel value="#{mbPasserCommande.commande.civiliteFacturation} #{mbPasserCommande.commande.nomFacturation}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.prenomFacturation}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.adresseFacturation}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.codePostalFacturation}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.villeFacturation}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.telFixeFacturation}"/><br/>
                                        <h:outputLabel value="#{mbPasserCommande.commande.telMobileFacturation}"/>
                                    </p:fieldset>
                                </p:column>
                            </p:row>
                        </p:panelGrid>
                        <p:commandButton action="#{mbPasserCommande.validerConfirmation(mbPanier.produitsList)}" value="Valider" update=":formPasserCommande:panelPasserCommande"/>
                    </p:panel>

                    <p:panel header="Paiement" rendered="#{mbPasserCommande.etapeVue == 4}">
                        <h:outputText value="N° Carte credit : " />  
                        <p:inputMask mask="9999-9999-9999"/>
                        <p:commandButton action="#{mbPasserCommande.validerPaiement()}" value="Valider" ajax="false"/>
                    </p:panel>
                    <p:commandButton value="Annuler commande" style="background-color:red;" action="#{mbPasserCommande.resetCommande()}" update=":formPasserCommande:panelPasserCommande"/>
                </p:panel>       
            </h:form>  
        </ui:define>
    </ui:composition>
</html>
